<template>
  <div class="callme">
    <el-scrollbar>
      <el-tabs stretch model-value="QQ">
        <el-tab-pane label="企鹅" name="QQ">
          <el-card>
            <img src="../assets/CallMe/Q.png" class="image" />
            <template #header>
              <span style="text-align: center">我们是:铁路开发学习交流群</span>
            </template>
            <div style="padding: 14px">
              <span> 本群为C#学习开发交流群 </span>
            </div>
          </el-card>
        </el-tab-pane>

        <el-tab-pane label="微信" name="WX">
          <el-card header="我们是:铁路开发学习交流群">
            <img src="../assets/CallMe/WX.jpg" class="image" />

            <div style="padding: 14px">
              <span> 本群为C#学习开发交流群 </span>
            </div>
          </el-card>
        </el-tab-pane>
      </el-tabs>
    </el-scrollbar>
  </div>
</template>
<style scoped>
.callme {
  /* border: 1px solid; */
  height: calc(100vh - 120px) !important;
  /* overflow: hidden; */
  .el-tabs {
    .el-tab-pane {
      display: flex;
      justify-content: center;
      width: 100%;
      .el-card {
        text-align: center;
        width: 100% !important;
        height: calc(100vh - 100px);
      }
    }
  }
}
</style>
